<ion-view title="请假申请">
  <ion-content>
    <div class="list">
      <label class="item item-input item-select">
        <div class="input-label">
          假期类型
        </div>
        <select ng-model="vacationsAddCtrl.vacation.type">
          <option ng-repeat="type in root.types" value="{{type.id}}">{{type.name}}
            {{type.duration != 0? type.duration + '天': ''}}</span>
        </option>
      </select>
    </label>
    <label class="item item-input item-stacked-label">
      <span class="input-label">申请理由</span>
      <textarea ng-model="vacationsAddCtrl.vacation.reason" placeholder="请填写申请理由" rows="5"></textarea>
    </label>
    <label class="item item-stacked-label">
      <span class="input-label">证明材料</span>
      <div>
        <img ng-repeat="src in vacationsAddCtrl.srclist" ng-src="{{src}}" style="width: 80px; height: 80px; padding: 5px 10px 5px 10px;"/>
        <button class="button button-clear icon ion-plus" ng-click="vacationsAddCtrl.showActionSheet()" ng-show="vacationsAddCtrl.srclist.length < 3" style="background-color: #fff; max-height:80px; height:80px; width: 80px"></button>
      </div>
    </label>
    <div class="item">
      <span class="input-label">时间精度</span>
      <ion-list>
        <ion-radio ng-model="vacationsAddCtrl.isdate" ng-value="true">天</ion-radio>
        <ion-radio ng-model="vacationsAddCtrl.isdate" ng-value="false">小时</ion-radio>
      </ion-list>
    </div>
    <div class="item">
      <span class="input-label">请假时间</span>
      <div class="">
        <p ng-repeat="item in vacationsAddCtrl.timelist" style="text-align: center">
          {{item.start | date:'MM月dd日HH点'}}
          ~
          {{item.end | date:'MM月dd日HH点'}}
          <i class="ion-close-round" ng-click="vacationsAddCtrl.deleteTime(item)" style="float: right; color: red"></i>
        </p>
      </div>
      <button class="button button-block button-positive" ng-click="vacationsAddCtrl.set('start')" ng-show="vacationsAddCtrl.isAdding">
        起始时间
        {{vacationsAddCtrl.startdate | date:'yy年MM月dd日'}}
        <standard-time-no-meridian etime="vacationsAddCtrl.starttime" ng-hide="vacationsAddCtrl.isdate"></standard-time-no-meridian>
      </button>
      <button class="button button-block button-assertive" ng-click="vacationsAddCtrl.set('end')" ng-show="vacationsAddCtrl.isAdding">
        终止时间
        {{vacationsAddCtrl.enddate | date:'yy年MM月dd日'}}
        <standard-time-no-meridian etime="vacationsAddCtrl.endtime" ng-hide="vacationsAddCtrl.isdate"></standard-time-no-meridian>
      </button>
      <button class="button button-block button-positive" ng-click="vacationsAddCtrl.isAdding = true" ng-hide="vacationsAddCtrl.isAdding">
        添加
      </button>
      <button class="button button-block button-positive" ng-click="vacationsAddCtrl.addTime(); vacationsAddCtrl.isAdding = false" ng-show="vacationsAddCtrl.isAdding">
        确定
      </button>
      <div>
        <ionic-datepicker id="datepicker" input-obj="vacationsAddCtrl.datepicker">
          <button class="button button-block button-positive" ng-if="false">
            {{vacationsAddCtrl.datepicker.inputDate | date:'yyyy年MM月dd日'}}
            <standard-time-no-meridian etime="vacationsAddCtrl.timepicker.inputEpochTime"></standard-time-no-meridian>
          </button>
        </ionic-datepicker>
      </div>
      <div>
        <ionic-timepicker id="timepicker" input-obj="vacationsAddCtrl.timepicker">
          <button class="button button-block button-light" ng-if="false">
            <!-- {{vacationsAddCtrl.timepicker.inputEpochTime}} -->
          </button>
        </ionic-timepicker>
      </div>
    </div>
  </div>
  <div style="height: 40px"></div>
</ion-content>

<div class="fixed-bottom">
  <button class="button button-full button-positive no-margin" ng-click="vacationsAddCtrl.public()" ng-disabled="!vacationsAddCtrl.vacation.reason || !vacationsAddCtrl.vacation.type || vacationsAddCtrl.timelist.length == 0 || vacationsAddCtrl.isAdding">
    <i class="ion-paper-airplane"></i>
    提交申请</button>
</div>
</ion-view>
